<template>
    <div style="width:400px; height: 450px;color: white;box-shadow:black;justify-content: center;align-items: center;">
        <Form :model="formRight" label-position="right" :label-width="100">
            <FormItem label="姓名">
                <Input v-model="formRight.input1"></Input>
            </FormItem>
            <FormItem label="个人邮箱">
                <Input v-model="formRight.input2"></Input>
            </FormItem>
            <FormItem label="电话号码">
                <Input v-model="formRight.input3"></Input>
            </FormItem>
            <FormItem label="家庭地址">
                <Input v-model="formRight.input4"></Input>
            </FormItem>
            <FormItem label="生日">
                <Input v-model="formRight.input5"></Input>
            </FormItem>
            <FormItem label="工作">
                <Input v-model="formRight.input6"></Input>
            </FormItem>
            <FormItem label="QQ">
                <Input v-model="formRight.input7"></Input>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="handleSubmit()">Submit</Button>
                <Button @click="handleReset()" style="margin-left: 8px">Reset</Button>
            </FormItem>
        </Form>
    </div>
</template>
<script>
export default {
    data() {
        return {
            formRight: {
                input1: '',
                input2: '',
                input3: '',
                input4: '',
                input5: '',
                input6: '',
                input7: '',
            }
        }
    },
    methods: {
        handleSubmit() {
            this.$Message.success('Success!');
            this.$router.push("/EmailSystemPages/Addressbook");

        }

    }
}


</script>

<style scoped>

</style>





